﻿@using System.Web.Script.Serialization
@{
    ViewBag.Title = "Status";
}

<span data-bind="html:FullDescription"></span>
<div>
    
<!-- ko foreach: Pics-->
    <img data-bind="attr:{src: PicUrl},click:ShowOriginalPic" /> 
<!-- /ko -->
</div>



<div class="comments_list" data-bind="visible:Comments().length>0">

    
    

        <!-- ko foreach: Comments-->

        <div class="row-fluid" >
            <div class="logo">

                <img data-bind="attr:{src: CustomerLogoUrl}" /> 
            </div>
            <div class="span9 column clickmsg" data-bind="attr:{link:'/status/' +Id()},click:GoOnePageProduct">
                <p  data-bind="html:Text">
                </p>
                
		
            </div>
           
        
            </div>
        <!-- /ko -->
        <div class="row-fluid" >
            <input type="button" value="More" data-bind="click:MoreComments,visible:Comments().length>0"  class="btn btn-primary span11"/>
        </div>
 </div>    


<textarea data-bind="value:NewComment">

</textarea>
<div class="status_operation">
    <!-- ko foreach: ProductVariantModels -->
     <input type="text" data-bind="value:SelectQuantity"/>

        <a data-bind="click:$root.AddToCart">Add to cart</a>
    <!-- /ko -->
    <a data-bind="click:$root.AddComment"> comment</a>
</div>



@{
    var model = ViewBag.Model;
    var jsonStr = new HtmlString(new JavaScriptSerializer().Serialize(model));
}

@section scripts
{
    <script>

        var init = @jsonStr;
        function StatusPictureModel(picId, picUrl) {

            var self = this;
            self.PicId = ko.observable(picId);
            self.PicUrl = ko.observable(picUrl);
            self.IsOrignalSize = ko.observable(false);
            self.PicSize = ko.observable(80);
            
            self.ShowOriginalPic = function() {

                if (self.IsOrignalSize() == true) {
                    self.IsOrignalSize(false);
                    self.PicSize(80);
                    $.ajax({
                        url: "/api/PicApi/GetPicUrl",
                        type: 'post',
                        data: ko.toJSON(self),
                        contentType: 'application/json',
                        success: function(result) {

                            self.PicUrl(result.PicUrl);
                        }
                    });
                } else {
                    self.IsOrignalSize(true);
                    self.PicSize(0);
                    $.ajax({
                        url: "/api/PicApi/GetPicUrl",
                        type: 'post',
                        data: ko.toJSON(self),
                        contentType: 'application/json',
                        success: function(result) {

                            self.PicUrl(result.PicUrl);
                        }
                    });
                }
               
            };
        }

       
        function CommentModel(createdAt, text) {

            var self = this;
            self.CreatedAt = ko.observable(createdAt);
            self.Text = ko.observable(text);
        }
        
        function ProductVariantModel(id, stockQuantity,price) {
            var self = this;
            self.Id = ko.observable(id);
            self.Price = ko.observable(price);
            self.SelectQuantity = ko.observable(1);
           
        }


        function AddToCartProductModel(productVariantId, selectQuantity, pvAttributeValues) {
            var self = this;
            self.ProductVariantId = productVariantId;
            self.Quantity = selectQuantity;
            self.ProductVariantAttributeValueIds = pvAttributeValues;
        }


        function StatusModel() {
            var self = this;
            self.FullDescription = ko.observable(init.Text);

            if (init.IsProduct) {
                var tempProductVariants = $.isEmptyObject(init.ProductStatusInfo.PvInfos) ? [] : $.map(init.ProductStatusInfo.PvInfos, function(a) {

                    return new ProductVariantModel(a.ProductVariantId, a.ProductStock, a.ProductPrice);
                });

                self.ProductVariantModels = ko.observableArray(tempProductVariants);
            } else {
                self.ProductVariantModels = ko.observableArray([]);
            }
            
            var tempPics = $.isEmptyObject(init.Pics) ? [] : $.map(init.Pics, function(p) {
                return new StatusPictureModel(p.PicId, p.PicUrl);
            });
            self.Pics = ko.observableArray(tempPics);
            
            var tempComments = $.isEmptyObject(init.Comments) ? [] : $.map(init.Comments, function(a) {
                return new CommentModel(a.CreatedAt, a.Text);
            });
            
            self.Comments = ko.observableArray(tempComments);
            self.NewComment = ko.observable();
            self.MoreComments = function() {


            };
            self.AddComment = function(c) {

            };
            self.AddToCart = function(pv) {
                var pvValueIds = [];
              
                
                //$.each(pv.ProductVariantAttributes(), function (idx, item) {
                //    var selectedAttributeValue = item.SelectedAttributeValue();
                //    pvValueIds.push(selectedAttributeValue.Id());
                //});

               
                var cartModel = new AddToCartProductModel( pv.Id(),pv.SelectQuantity(),  pvValueIds);
                $.ajax({
                    url: "/api/ShoppingCartApi/AddProductVariantToCart",
                    type: 'post',
                    data: ko.toJSON(cartModel),
                    contentType: 'application/json',
                    success: function(result) {

                        if (result.Status == "0") {
                            alert("保存成功");
                        } else {
                            toastr.error( result.Message);
                        }
                    }
                });
            };
        }

        var vm = new StatusModel();
        ko.applyBindings(vm);
    </script>
}